<!DOCTYPE HTML>
<html>
<head>
<title>材料列表</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>

<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />

<!-- Custom CSS -->
<link href="css/style.css" rel='stylesheet' type='text/css' />

<!-- font-awesome icons CSS -->
<link href="css/font-awesome.css" rel="stylesheet"> 
<!-- //font-awesome icons CSS -->

<!-- side nav css file -->
<link href='css/SidebarNav.min.css' media='all' rel='stylesheet' type='text/css'/>
<!-- side nav css file -->
<link href='css/commodity.css' media='all' rel='stylesheet' type='text/css'/>

<!-- js-->
<script src="js/jquery-1.11.1.min.js"></script>

<!--webfonts-->
<link href="http://fonts.googleapis.com/css?family=PT+Sans:400,400i,700,700i&amp;subset=cyrillic,cyrillic-ext,latin-ext" rel="stylesheet">
<link href='css/new-goods.css' media='all' rel='stylesheet' type='text/css'/>
<!--//webfonts-->

<!-- Metis Menu -->
<script src="js/metisMenu.min.js"></script>
<script src="js/custom.js"></script>
<link href="css/custom.css" rel="stylesheet">
<!--//Metis Menu -->

<!-- calendar -->
<link rel="stylesheet" href="css/monthly.css">
<!-- //calendar -->

</head> 
<body class="cbp-spmenu-push">
	<div class="main-content">
	<div class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1">
		<!--left-fixed -navigation-->
		<aside class="sidebar-left">
      <nav class="navbar navbar-inverse">
          <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".collapse" aria-expanded="false">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            </button>
            <h1><a class="navbar-brand" href="index.html"><span class="fa fa-pie-chart"></span>智能工程管理平台</a></h1>
          </div>
          <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="sidebar-menu">
              <li class="header">MAIN NAVIGATION</li>
              <li class="treeview">
                <a href="index.html">
                <i class="fa fa-dashboard"></i> <span>首 页</span>
                </a>
              </li>
			  <li class="treeview">
                <a href="#">
                <i class="fa fa-th"></i>
                <span>分类管理</span>
                <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="treeview-menu">
                  <li><a href="classify.html"><i class="fa fa-angle-right"></i>材料分类</a></li>
                </ul>
              </li>
              <li class="treeview">
                <a href="#">
               <i class="fa fa-laptop"></i>
                <span>材料管理</span>
                <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="treeview-menu">
                  <li><a href="commodity.html"><i class="fa fa-angle-right"></i>材料列表</a></li>
                  <li><a href="new-goods.html"><i class="fa fa-angle-right"></i>添加材料</a></li>
                </ul>
              </li>
               <li class="treeview">
                <a href="#">
                <i class="fa fa-edit"></i>
                <span>项目管理</span>
                <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="treeview-menu">
                    <li><a href="Message.html"><i class="fa fa-angle-right"></i>进度报告</a></li>
                    <li><a href="Base.html"><i class="fa fa-angle-right"></i>检测报告</a></li>
                    <li><a href="Mountain.html"><i class="fa fa-angle-right"></i>员工考核</a></li>
                    <li><a href="media.html"><i class="fa fa-angle-right"></i>新增项目</a></li>
                </ul>
              </li>
              <li class="treeview">
                <a href="charts.html">
                <i class="fa fa-pie-chart"></i>
                <span>公告管理</span>

                </a>
              </li>
              <li class="treeview">
              <li class="treeview">
                <a href="#">
                <i class="fa fa-laptop"></i>
                <span>用户管理</span>
                <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="treeview-menu">
                  <li><a href="user.html"><i class="fa fa-angle-right"></i>用户列表</a></li>
                  <li><a href="new-user.html"><i class="fa fa-angle-right"></i>新增用户</a></li>
                </ul>
              </li>
			  <li>
                <a href="literature.html">
                <i class="fa fa-th"></i> <span>施工规范</span>

                </a>
              </li>
               <li class="treeview">
                <a href="#">
                <i class="fa fa-folder"></i> <span>仓库管理</span>
                <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul class="treeview-menu">
                    <li><a href="tool.html"><i class="fa fa-angle-right"></i>工具管理</a></li>
                    <li><a href="vacation.html"><i class="fa fa-angle-right"></i>仓库统计</a></li>
                </ul>
              </li>
                <li class="treeview"> <a href="userStatistics.html"> <i class="fa fa-pie-chart"></i> <span>合格率统计</span> </a> </li>
            </ul>
          </div>
          <!-- /.navbar-collapse -->
      </nav>
    </aside>
	</div>
		<!--left-fixed -navigation-->
		
		<!-- header-starts -->
		<div class="sticky-header header-section ">
			<div class="header-left">
				
				<!--toggle button start-->
				<button id="showLeftPush"><i class="fa fa-bars"></i></button>
				<!--toggle button end-->
				<!--notification menu end -->
				<div class="clearfix"> </div>
			</div>

			<div class="clearfix"> </div>	
		</div>
		<!-- //header-ends -->
		<!-- main content start-->
		<div id="page-wrapper">
			<div class="main-page">
				<div class="palette">
                	<span class="pull-left mar-r-5 mar-t-8"><i class="fa fa-th mar-r-5"></i>材料名称</span>
						<input id="name" class="palette-input" type="text" required>
						<input class="btn btn-info" type="submit" value="搜索" onclick="init()"/>
                <!--        <button class="btn btn-warning" onclick="upCommodity()">上架</button>
                        <button class="btn btn-warning" onclick="downCommodity()">下架</button>-->
					<a href="new-goods.html"><button type="button"  class="pull-right btn btn-primary ">新增材料</button></a>
                </div>
				<div id="list" class="elements">
                	<div class="col-sm-12 w3-agileits-crd widgettable">
                            <div class="card">
                                <div class="card-body">
									<div id="commodityList" class="agileinfo-cdr">

										<div class="card-header">
											<h3>材料列表</h3>
										</div>
										<hr class="widget-separator">
												<div class="widget-body">
													<table id="materialList" class="table table-bordered" >
													</table>
													<ul  id="queryList" class="pagination pagination-lg"></ul>
												</div>
										</div>
										<div id="updateMaterial"  class="modal fade" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
											<div class="modal-dialog" role="document">
												<div class="modal-content">
													<div class="modal-body">
														<form id="uploadPic" enctype="multipart/form-data" class="form-horizontal">
															<div class="form-group">
																<label for="inputPassword" class="col-sm-2 control-label">材料名称</label>
																<div class="col-sm-3">
																	<input id="materialName" name="materialName" type="text" class="form-control1" placeholder="请在此输入商品名称" maxlength="20">
																</div>
															</div>
															<div class="form-group">
																<label class="col-sm-2 control-label">材料分类</label>
																<div class="col-sm-8">
																	<select id="firstMaterial" name="firstMaterial" class="ui-select mar-r-5">
																	</select>
																	<select id="twoMaterial" name="twoMaterial" class="ui-select mar-r-5">
																	</select>
																</div>
															</div>
															<div class="form-group">
																<label class="col-sm-2 control-label">材料备注</label>
																<div class="col-sm-5">
																	<textarea id="materialDesc" name="materialDesc" style="width: 450px;height: 200px" class="form-control1" placeholder="请在此输入简介,不可大于一百文字描述" maxlength="100"></textarea>
																</div>
															</div>
														</form>
													</div>
													<div class="modal-footer">
														<button type="button" class="btn btn-primary" onclick="updateMaterial()">确认</button>
														<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
													</div>
												</div>
											</div>
										</div>
                                </div>
                            </div>
                    </div>
					<!--photoday-section-->	
					<div class="clearfix"></div>
				</div>
				</div>
			</div>
		</div>
		<!--footer-->
		<div class="footer">
		   <p>敦化市建筑安装有限公司</p>
	   </div>
        <!--//footer-->
	</div>

	<!-- side nav js -->
	<script src='js/SidebarNav.min.js' type='text/javascript'></script>
	<script>
      $('.sidebar-menu').SidebarNav()
    </script>

	<!-- Chartinator  -->
	<script src="js/chartinator.js" ></script>
	<script src="js/factory/config.js"></script>
	<script src="js/factory/newGood.js"></script>
	<script type="text/javascript" charset="utf-8" src="js/factory/material.js"></script>
    <script type="text/javascript">
        jQuery(function ($) {

            var chart3 = $('#geoChart').chartinator({
                tableSel: '.geoChart',

                columns: [{role: 'tooltip', type: 'string'}],

                colIndexes: [2],

                rows: [
                    ['China - 2015'],
                    ['Colombia - 2015'],
                    ['France - 2015'],
                    ['Italy - 2015'],
                    ['Japan - 2015'],
                    ['Kazakhstan - 2015'],
                    ['Mexico - 2015'],
                    ['Poland - 2015'],
                    ['Russia - 2015'],
                    ['Spain - 2015'],
                    ['Tanzania - 2015'],
                    ['Turkey - 2015']],

                ignoreCol: [2],

                chartType: 'GeoChart',

                chartAspectRatio: 1.5,

                chartZoom: 1.75,

                chartOffset: [-12,0],

                chartOptions: {

                    width: null,

                    backgroundColor: '#fff',

                    datalessRegionColor: '#F5F5F5',

                    region: 'world',

                    resolution: 'countries',

                    legend: 'none',

                    colorAxis: {

                        colors: ['#679CCA', '#337AB7']
                    },
                    tooltip: {

                        trigger: 'focus',

                        isHtml: true
                    }
                }


            });
        });
    </script>
    <!--geo chart-->
	<script src="js/classie.js"></script>
	<script type="text/javascript">
     /*   var ue = UE.getEditor("content");*/
        var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
            showLeftPush = document.getElementById( 'showLeftPush' ),
            body = document.body;

        showLeftPush.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( body, 'cbp-spmenu-push-toright' );
            classie.toggle( menuLeft, 'cbp-spmenu-open' );
            disableOther( 'showLeftPush' );
        };

        function disableOther( button ) {
            if( button !== 'showLeftPush' ) {
                classie.toggle( showLeftPush, 'disabled' );
            }
        }

	</script>
	<!-- calendar -->
	<script type="text/javascript" src="js/monthly.js"></script>
	<script src="js/jquery.nicescroll.js"></script>
	<script src="js/scripts.js"></script>
   <script src="js/bootstrap.js"> </script>

</body>
</html>